import React from 'react'

import {Form, Input, Tooltip, Icon, Cascader, Select, Row, Col, Checkbox, Button, AutoComplete, Modal} from 'antd';
const FormItem = Form.Item;
const Option = Select.Option;
class ChangeRolesModal extends React.Component {
    constructor(props) {
        super(props);
        this.roleIdArray=[];
    }
    roleHandleCancel() {
        this.props.roleHandleCancel()
    }
    //当前用户的角色ID数组
    setRoleIdArray(array){
        this.roleIdArray=array;
    }

    roleHandleOk() {
        this.props.roleHandleOk();
    }

    onChange(checkedValues) {
        this.props.roleIdArrayOnChange(checkedValues);
    }
    render() {
        var testCheckLis = [];
        for (let checkbox of  this.props.checkboxList) {
            testCheckLis.push(
                <Col key={checkbox.value} xs={12} sm={12} md={6} lg={6} xl={6} style={{paddingTop: 20, paddingBottom: 20}}><Checkbox
                value={checkbox.value}>{checkbox.name}</Checkbox></Col>)
        }
        return (
            <Modal
                width={650}
                title='配置角色'
                visible={this.props.modalRoleShow}
                onCancel={this.roleHandleCancel.bind(this)}
                footer={[
                    <Button key="back" onClick={this.roleHandleCancel.bind(this)}>取消</Button>,
                    <Button key="submit" type="primary" onClick={this.roleHandleOk.bind(this)}>
                        提交
                    </Button>,
                ]}>
                <Row>
                    <Checkbox.Group style={{ width: '100%' }} onChange={this.onChange.bind(this)} value={this.props.roleIdArray}>
                        {testCheckLis}
                    </Checkbox.Group>
                </Row>
            </Modal>
        )
    }
}
export default ChangeRolesModal